<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <title>加载中</title>
    <script src="https://app.epaynfc.com/jsapi/hsh-jsapi-1.0.0.js"></script>
    <script src="http://www.jq22.com/jquery/jquery-1.10.2.js" type="text/javascript"></script>
    <script src="http://cdn.baifm.cn/1/001/jquery.shCircleLoader.js" type="text/javascript"></script>
    <style type="text/css">
        body {text-align:center;}
        h2 {margin:5px;padding:0}
        div[id] {width:100px; height:100px; margin:10px auto;}
        span {font-family:monospace;font-size: 30px}
        pre {text-align:left;margin:0 auto;border:1px solid #888;padding:3px;width:400px;background:#eee}
        .myns > div {
            box-shadow: 0 0 6px black, inset 0 0 6px black;
        }

    </style>
    <script>

        hsh.hshReady(function () {
            hsh.getToken(function (resonpseData) {
                Token=resonpseData.HARToken
                if(Token){
                    location.replace("https://app.epaynfc.com/fueling/main?appid=n5xqblcz266uzic&Token="+Token.replace(/\+/g,"%2B")+"&Pid=<%=Pid%>")
                }
            })
        })



    </script>
</head>
<body>
<div id="shclProgress" style="align-content: center;padding: 20% "></div>

<script type="text/javascript">
    $('#shclDefault').shCircleLoader();
    $('#shclCcw').shCircleLoader({clockwise:false});
    $('#shclColor').shCircleLoader({color:"#f00"});
    $('#shclDuration').shCircleLoader({duration: 2});
    $('#shclDots').shCircleLoader({dots:24,dotsRadius:10});
    $('#shclKeyframes').shCircleLoader({keyframes:"0%{background:black}40%{background:transparent}60%{background:transparent}100%{background:black}"});
    $('#shclNs').shCircleLoader({namespace:"myns",color:"transparent",dotsRadius:15});
    $('#shclFireballs').shCircleLoader({
        color: "red",
        dots: 24,
        dotsRadius: 13,
        keyframes:
                "0%   {background: red;    {prefix}transform: scale(1)}\
                 20%  {background: orange; {prefix}transform: scale(.4)}\
                 40%  {background: red;    {prefix}transform: scale(0)}\
                 50%  {background: red;    {prefix}transform: scale(1)}\
                 70%  {background: orange; {prefix}transform: scale(.4)}\
                 90%  {background: red;    {prefix}transform: scale(0)}\
                 100% {background: red;    {prefix}transform: scale(1)}"
    });

    $('#shclProgress').shCircleLoader();
    var i = 0;
    setInterval(function() {
        $('#shclProgress').shCircleLoader('progress', i + '%');
        if (++i > 100) i = 0;
    }, 100);
</script>
</body>
</html>

